---
import { GITHUB_EDIT_URL } from '../config';
import WidgetContent from '../components/WidgetContent.astro';
import WidgetsList from '../components/WidgetsList.astro';
import type { WidgetFrontmatter } from '../types';
import MainLayout from './MainLayout.astro';

type Props = {
  frontmatter: WidgetFrontmatter;
};

const { frontmatter } = Astro.props;
const currentPage = Astro.url.pathname;
const currentFile = `${currentPage.replace(/specs/, 'specs/src/pages')}.md`;
const githubEditUrl = `${GITHUB_EDIT_URL}${currentFile}`;
---

<MainLayout title={frontmatter.title}>
  <div class="wrapper">
    <WidgetsList />
    <WidgetContent frontmatter={frontmatter} githubEditUrl={githubEditUrl} />
  </div>
</MainLayout>
